//搜索面板
.search-box {
  $expand-el-width: 740px;

  &.search-inline {
    .el-form {
      .el-form-item {
        margin-bottom: 0;
        margin-right: 10px;

        &:last-child {
          margin-right: 0 !important;
        }

        &:last-child {
          .el-form-item__label {
            display: none;
          }
        }

        .el-form-item__label {
          display: inline-block;
          background-color: var(--el-color-primary);
          text-align: justify;
          text-justify: inter-word;
          text-align-last: justify;
          text-align: -webkit-center;
          padding: 0 8px;
          border-radius: 3px 0 0 3px;
          color: var(--el-color-white);
        }

        .el-input__wrapper,
        .el-select__wrapper {
          border-radius: 0 var(--el-input-border-radius, var(--el-border-radius-base)) var(--el-input-border-radius, var(--el-border-radius-base)) 0;
        }
      }
    }
  }

  &.search-expand {
    position: absolute;
    z-index: 10;
    left: 0;
    top: 0;
    box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.3);
    transition: box-shadow 0.3s ease; /* 添加过渡效果 */
    border-radius: 0 0 6px 0;
    background: var(--el-card-bg-color);
    padding: 20px 15px 5px 15px;
    max-width: $expand-el-width;
    min-width: 540px;

    .form-title {
      color: var(--el-color-primary);
      font-weight: bold;
      margin-bottom: var(--app-interval);

      .app-svg-icon {
        vertical-align: sub;
        fill: var(--el-color-primary);
        font-weight: bold;
      }
    }

    .el-form {
      .el-form-item__content {
        display: block;
        text-align: right;
      }
    }
  }

  &.search-placeholder {
    visibility: hidden;
  }

  .change-expand {
    padding: 0 3px;
  }
}


//全局消息提示
.app-modal-message {
  width: 320px !important;

  .el-message-box__content {
    margin-top: 10px;
  }
}


//svg图标组件
.app-svg-icon {
  box-sizing: border-box;
  outline: none;

  //动画animation start
  @keyframes blink {
    0% {
      fill: var(--el-color-primary);
    }
    50% {
      fill: var(--el-text-color-regular);
    }
    100% {
      fill: var(--el-color-primary);
    }
  }

  &.animation-blink {
    animation: blink 1s infinite;
  }
}


//函数组件弹出框
.popup-component {
  &.popup-form {
    min-height: 160px;
  }

  .el-message-box__content {
    width: 100%;
    max-height: calc(var(--inner-height) * 0.83);
    padding: 10px !important;
    overflow-y: scroll;
    /* 设置滚动条的宽度 */
    &::-webkit-scrollbar {
      width: 2px; /* 定义滚动条的宽度 */
    }

    /* 设置滚动条滑块的样式 */
    &::-webkit-scrollbar-thumb {
      background: var(--el-color-primary); /* 定义滑块的背景颜色 */
    }

    .el-message-box__container {
      width: 100%;

      .el-message-box__message {
        width: 100%;

        .el-page-header__content {
          color: var(--el-color-primary);
          font-size: 16px;
        }
      }
    }
  }

  .el-message-box__btns {
    padding: 0 10px 10px 10px !important;
  }
}

//重写element el-page-header组件样式
.el-page-header {
  .el-page-header__header {
    .el-page-header__left {
      .el-page-header__back, .el-divider {
        display: none;
      }
    }
  }

  &[show-back] {
    .el-page-header__header {
      .el-page-header__left {
        .el-page-header__back {
          display: flex;
        }

        .el-divider {
          display: inline-block;
        }
      }
    }
  }
}

//百度富文本
.edui-popup-content {
  /* 设置滚动条的宽度 */
  &::-webkit-scrollbar {
    width: 2px; /* 定义滚动条的宽度 */
  }

  /* 设置滚动条滑块的样式 */
  &::-webkit-scrollbar-thumb {
    background: var(--el-color-primary); /* 定义滑块的背景颜色 */
  }
}

//详情面板 /components/DetailPanel/Index.vue
.detail-panel {
  .el-drawer__header {
    padding: 10px !important;
  }

  .el-drawer__body {
    padding: 10px !important;
    //overflow-y: hidden;

    .el-descriptions {
      margin-bottom: 10px;

      .el-descriptions__table {
        border-radius: 0 !important;

        tbody {
          tr {
            th {
              font-weight: bold;
              border-radius: 0 !important;
            }

            td {
              border-radius: 0 !important;
            }
          }
        }
      }
    }
  }
}

//表单内编辑图标 /components/LineEditIcon.vue
.line-edit-icon {
  margin-left: 5px;
  cursor: pointer;
}